<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>耳鼻喉科体检填写表单</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/build.css?v=1">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layui/layui.js" media="all">
    <link rel="stylesheet" href="/css/custom.form.css">
    <link rel="stylesheet" href="/css/build.css?v=1">
    <style>
        .input{
            font-size: 16px;font-weight: bolder;font-family: 宋体;
        }
        .Impact{
            background-color: #6a79d6;
        }

        /*.WithUnit{*/
        /*    width: 90%;*/
        /*}*/
        /*layui-form-label{*/
        /*   margin-left: 10pt;*/
        /*    width: 30px;*/
        /*}*/
    </style>
</head>
<body>
<div>

    <div class="panel panel-default operation_dept" hidden>
        <fieldset class="layui-elem-field layui-field-title " style="margin-top: 25px;">
            <legend style="font-size: 25px;">
                耳鼻喉科体检表
            </legend>
            <div class="layui-row">
                <div  class="layui-col-md6">
                    <legend  style="font-size: 17px;font-weight: bolder;font-family: 华文宋体">
                        <div align="center"  >
                            学号：<nobr id="Stu_id" ></nobr>
                        </div>
                    </legend>
                </div>
                <div  class="layui-col-md6">
                    <legend  style="font-size: 17px;font-weight: bolder;font-family: 华文宋体">
                        <div align="center" >
                            姓名：<nobr id="Stu_name"></nobr>
                        </div>
                    </legend>
                </div>
            </div>
        </fieldset>

        <form class="layui-form " action="" lay-filter="deptInfo" >
            <div class="layui-form-item" >
                <div class="layui-inline">
                    <label class="layui-form-label input">咽喉</label>
                    <div class="layui-input-inline">
                        <input  type="text" name="EBH_throat" value="正常" lay-verify="required" autocomplete="off" placeholder="请输入咽喉情况" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label input">口吃</label>
                    <div class="layui-input-inline">
                        <input type="text" name="EBH_stammer" value="正常" lay-verify="required" autocomplete="off" placeholder="请输入口吃情况" class="layui-input">
                    </div>
                </div>
            </div>



            <div class="layui-form-item " >
                <lable class="layui-form-label input ">医生意见</lable>

                <div class="layui-input-block">
                    <textarea  name="EBH_idea"  placeholder="请输入医生意见" lay-verify="required"  class="layui-textarea">正常</textarea>
                </div>
            </div>


            <div class="layui-form-item" align="center">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn Impact" lay-submit="" lay-filter="save">保存</button>
                    <button class="layui-btn layui-btn-primary" id="btn_cancel" onclick="cancel()">返回</button>
                </div>
            </div>

        </form>



    </div>

    <!--数据表格-->
    <div class="table_div">
        <div id="searchParam"  >
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="number" id="idd"  class="layui-input"  autocomplete="off" placeholder="请输入学生id">
                </div>

                <div class="layui-input-inline ">
                    <button class="layui-btn Impact" id="searchID" data-type="reload">搜索</button>
                </div>
                <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                    <legend style="font-size: 20px;">耳鼻喉科</legend>
                </fieldset>
            </div>

        </div>

        <table class = "layui-hide" id = "stutable" lay-filter = "stutable" ></table>
    </div>
</div>



<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs Impact" lay-event="edit">录入体检数据</a>
</script>
<script src="/layui/layui.js"></script>
<script src="/layui/layui.all.js"></script>
<script src="/js/core.util.js"></script>
<script src="/js/jquery.js"></script>
<script src="/js/jquery.fileDownload.js"></script>
<script >
    //获取token
    var token = CoreUtil.getData("access_token");
    //地址栏转义token中的#号
    var tokenQuery = token.replace("#", "%23");
    var tableIns1;
    var table = layui.table;

    var $ = jQuery = layui.jquery;
    var laydate = layui.laydate;
    layui.use(['element','layer','form','table', 'laydate'],function(){

        table.render({
            elem: '#stutable'
            ,headers: {"authorization": token}
            ,url:'/ebh/getStuList'
            ,title: '耳鼻喉科数据表'
            ,cols:
                [
                    [
                        {field: 'Stu_id', title: '编号', width:80, sort: true, fixed:true, align:'center'}
                        ,{field: 'Stu_name', title: '姓名', width:80, align:'center'}
                        ,{field: 'Stu_card', title: '身份证', width:150, sort: true, align:'center'}
                        ,{field: 'Stu_college', title: '学院', width:100, align:'center'}
                        ,{field: 'Stu_major', title: '专业', width: 100, align:'center'}
                        ,{field: 'Stu_class', title: '班级', width: 100, sort: true, align:'center'}
                        ,{field: 'Stu_num', title: '学号', width: 100, sort: true, align:'center'}
                        ,{field: 'Stu_sex', title: '性别', width: 50, align:'center'}
                        ,{field: 'Stu_birth', title: '出生年月日', width: 120, sort: true, align:'center'}
                        , {
                        field: 'EBH_all', title: '状态', width: 80, sort:true,  templet: function (item) {
                            if (item.EBH_all === "1") {
                                return ' <button type="button" class="layui-btn layui-btn-xs layui-btn-radius layui-btn-normal">已填</button>';
                            }
                            if (item.EBH_all === "0") {
                                return '<button type="button" class="layui-btn layui-btn-xs layui-btn-radius  layui-btn-primary">未填</button>';
                            }
                            if (item.EBH_all === "2") {
                                return '<button type="button" class="layui-btn layui-btn-xs layui-btn-radius layui-btn-danger">驳回</button>';
                            }
                        }
                    }
                        ,{fixed:'right', title: '操作', width:140,toolbar:"#barDemo", align:'center'}

                    ]
                ]
            ,id: 'testReload'
            ,page: true

        });


        /*****************************工具栏**************************/
        table.on('tool(stutable)', function(obj){
            var data = obj.data;
            //console.log(obj)

            /*****************************点击编辑**************************/
            if(obj.event === 'edit'){
                var tabledata = obj.data;
                //标注选中样式
                $(".operation_dept").show();
                $(".table_div").hide();
                $("#Stu_id").html(tabledata.Stu_id);
                $("#Stu_name").html(tabledata.Stu_name);
                //方法 得到数据
                $.ajax({
                    url: '/ebh/getEbhInfo',
                    method: 'post',
                    headers: {"authorization": token},
                    data: {"Stu_id":tabledata.Stu_id},
                    dataType: 'JSON',
                    success: function (res) {
                        if (res.code = '0') {
                            console.log(res);
                            console.log(res.data[0]);
                            for( var key in res.data[0] ){
                                console.log( key+' : '+res.data[0][key]);
                                $('[name='+key+']').val(res.data[0][key]);
                            }
                        } else
                            alert(res.msg);
                    },
                    error: function (data) {

                    }
                });
            }
        });

    });



    /*****************************表格搜索**************************/
    var $ = layui.$, active = {
        reload: function () {
            var idd = $('#idd');
            console.log("hello1");
            table.reload('testReload', {

                where: {
                    Stu_id: idd.val()
                }
            });
        }
    };
    var search = document.getElementById("idd");
    search.addEventListener("keyup", function(event) {
        event.preventDefault();
        if (event.keyCode === 13) {
            console.log("hello");
            document.getElementById("searchID").click();
        }
    });
    $('.layui-btn').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });

    /*****************************表单界面*********************/

    function cancel(){
        $(".operation_dept").hide();
        $(".table_div").show();
    };
    layui.use(['form','layer','element'], function () {
        var form = layui.form;
        var layer = layui.layer;
        form.on('submit(save)', function (data) {
            console.log("save事件被触发了")
            data.field.Stu_id = $("#Stu_id").html();
            $.ajax({
                type: 'POST',
                url: '/ebh/insertEbhInfo',
                headers: {"authorization": token},
                dataType: "JSON",
                data: data.field,
                success:function (string){
                    console.log(string);
                    if(string.code === 500001){
                        layer.msg('录入失败',{time: 1000}, function(){
                            $(".operation_dept").hide();
                            $(".table_div").show();
                            location.reload();
                        });
                    }
                    else{
                        layer.msg('录入成功',{time: 1000},function(){
                            $(".operation_dept").hide();
                            $(".table_div").show();
                            location.reload();
                        });
                    }
                }
            })

            return false;
        });
    });
</script>
</body>
</html>